@charset "utf-8";
/* CSS Document */

/*Hack footer toujours en bas*/
html,body{height: 100%;}

#wrapper{	
    min-height:100%;
    position:relative;
}

#container {
    padding-bottom:110px;
    overflow: hidden;
}

/*Hack end*/

body, h1, h2, h3, h4, h5, h6, blockquote, p, form, input, ul, li, div {
	margin: 0;
	padding: 0;
}
body{
	margin:0;
	color:#333;
	font-family:Tahoma;
	font-size:12px;
}

h2{
	font-size:18px;
}

h3{
	font-size:12px;
	padding:10px 0; 
}

.a_black a:link,.a_black a:visited
{
    	color:black;
	text-decoration:none;
}

.a_black a:hover
{
    color:black;
    text-decoration: underline;
}
a:link, a:visited{
	color:#aafbef;
	text-decoration:none;
}

a:hover{
	color:#fff;
}

#container, #header, #banner, #footer-container{
	width:950px;
	margin:0 auto 0 auto;
}


#head{
	height:80px;
	background-color:#333;
	padding-top:25px;
}



#logo{
	float:left;
	width:264px;
	padding-right:20px;
}

#menu{
	padding-top:10px;
	text-align:right;
}

#menu li{
    display:inline;
	list-style:none;
	/*margin-left:5px;*/
	padding:10px;
}

#menu a{
	padding:5px;
	color:#aafbef;
}

#menu a:link, #menu a:visited{
	color:#fff;
}

.lock
{
    width:32px;
    height: 32px;
    margin-bottom: -8px;
    margin-top: 10px;
}

.deco{
    width:16px;
    height:16px;
    margin-bottom: -3px;
}

#page_login
{
    font-size:18px;
    
}

.buttonlogin{
padding: 0.3em 0.6em;
box-shadow: 0px 2px 1px rgba(0, 0, 0, 0.3), 0px 1px 0px rgba(170, 170, 170, 0.4) inset;
background-color: #333;
color: #FFF;
border: 1px solid #000 !important;
border-radius: 3px;
text-decoration: none;
}


#banner{
	padding-top:10px;
}

#arianne
{
    font-size: 14px;
    font-weight: bold;
}

#arianne a { color: #005B8D;}

#arianne a:hover
{
    color: #207BAD;
}

/* ----------------------- content style -------------------------*/

#top{
	padding:10px 0 0 0;
}

#mainlarge{
    float:left;
    width:920px;
    padding:0 15px 10px 10px;
}

#main{
	float:left;
	width:620px;
	padding:0 15px 10px 10px;
}

#main h1,h2, #mainlarge h1,h2{
        color:#005B8D;
	//color:#00cbad;
	padding:15px 0 15px 0;
}

#main p, #mainlarge p{
	padding:0 0 5px 0;
}

#sidebar, .box{
	float:left;
	width:300px;
	background-color:#cae1e1;
	padding:0 0 10px 0;
	}

.align{
	margin-right:22px;
}

#sidebar p, #sidebar h3, .box p{
	padding:10px 20px 0 20px;
}

#sidebar h2, .box h2{
	text-align:center;
	padding:10px 0 0 0;
}

#sidebar a:link, #sidebar a :visited{
	color:#333;
}

#sidebar a:hover{
	text-decoration:underline;
}


.box{
	margin-top:10px;
	margin-bottom:10px;
}

.img{
	text-align:center;
	padding:0;
}

.box-image{
	text-align:center;
	padding:10px 0 0 0;
}

.box-link-background{
	background-color:#323333;
	color:#aafbef;
	width:85px;
	padding:5px 0;
	margin:10px 20px 10px 20px;
	text-align:center;
}


/* --------------------------- footer style --------------------------- */

#footer{
	clear:both;
	background-color:#323333;
	color:#fff;
        
                /*hack alwayd bottom*/
        width:100%;
        position:absolute;
        bottom:0;
        left:0;
}

#footer-container{
	padding:10px 0;
	overflow:hidden;
}

#address{
	float:left;
}

#menu-bottom{
	float:right;
	text-align:right;
}

/* ------------------ inner page style -----------------*/

.inner-list{
	list-style:circle;
	padding-left:20px;
}

.name{
	font-weight:bold;
	font-style:italic;
	text-align:right;
}

/* ------------------ contact style -----------------*/

form{
	margin-top:10px;
}

.form-element{
	width:350px;
	height:20px;
}

.form-area{
	width:350px;
	height:200px;
}


/* -------------Keyboard number------------*/
.keynumber {
	-moz-box-shadow:inset 0px 1px 0px 0px #bbdaf7;
	-webkit-box-shadow:inset 0px 1px 0px 0px #bbdaf7;
	box-shadow:inset 0px 1px 0px 0px #bbdaf7;
	background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #79bbff), color-stop(1, #378de5));
	background:-moz-linear-gradient(top, #79bbff 5%, #378de5 100%);
	background:-webkit-linear-gradient(top, #79bbff 5%, #378de5 100%);
	background:-o-linear-gradient(top, #79bbff 5%, #378de5 100%);
	background:-ms-linear-gradient(top, #79bbff 5%, #378de5 100%);
	background:linear-gradient(to bottom, #79bbff 5%, #378de5 100%);
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#79bbff', endColorstr='#378de5',GradientType=0);
	background-color:#79bbff;
	-moz-border-radius:6px;
	-webkit-border-radius:6px;
	border-radius:6px;
	border:1px solid #84bbf3;
	display:inline-block;
	cursor:pointer;
	color:#ffffff;
	font-family:arial;
	font-size:15px;
	font-weight:bold;
	padding:6px 15px;
	text-decoration:none;
	text-shadow:0px 1px 0px #528ecc;
        -webkit-touch-callout: none;
        -webkit-user-select: none;
        -khtml-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none;
}
.keynumber:hover {
	background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #378de5), color-stop(1, #79bbff));
	background:-moz-linear-gradient(top, #378de5 5%, #79bbff 100%);
	background:-webkit-linear-gradient(top, #378de5 5%, #79bbff 100%);
	background:-o-linear-gradient(top, #378de5 5%, #79bbff 100%);
	background:-ms-linear-gradient(top, #378de5 5%, #79bbff 100%);
	background:linear-gradient(to bottom, #378de5 5%, #79bbff 100%);
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#378de5', endColorstr='#79bbff',GradientType=0);
	background-color:#378de5;
}
.keynumber:active {
	position:relative;
	top:1px;
}

.keyboard{margin-top:15px}

.keyMargin{margin-bottom: 5px;}


.grayButton {
	-moz-box-shadow:inset 0px 1px 0px 0px #ffffff;
	-webkit-box-shadow:inset 0px 1px 0px 0px #ffffff;
	box-shadow:inset 0px 1px 0px 0px #ffffff;
	background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #f9f9f9), color-stop(1, #e9e9e9));
	background:-moz-linear-gradient(top, #f9f9f9 5%, #e9e9e9 100%);
	background:-webkit-linear-gradient(top, #f9f9f9 5%, #e9e9e9 100%);
	background:-o-linear-gradient(top, #f9f9f9 5%, #e9e9e9 100%);
	background:-ms-linear-gradient(top, #f9f9f9 5%, #e9e9e9 100%);
	background:linear-gradient(to bottom, #f9f9f9 5%, #e9e9e9 100%);
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#f9f9f9', endColorstr='#e9e9e9',GradientType=0);
	background-color:#f9f9f9;
	-moz-border-radius:6px;
	-webkit-border-radius:6px;
	border-radius:6px;
	border:1px solid #dcdcdc;
	display:inline-block;
	cursor:pointer;
	color:#444444;
	text-decoration:none;
	text-shadow:0px 1px 0px #ffffff;
}
.grayButton:hover {
	background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #e9e9e9), color-stop(1, #f9f9f9));
	background:-moz-linear-gradient(top, #e9e9e9 5%, #f9f9f9 100%);
	background:-webkit-linear-gradient(top, #e9e9e9 5%, #f9f9f9 100%);
	background:-o-linear-gradient(top, #e9e9e9 5%, #f9f9f9 100%);
	background:-ms-linear-gradient(top, #e9e9e9 5%, #f9f9f9 100%);
	background:linear-gradient(to bottom, #e9e9e9 5%, #f9f9f9 100%);
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#e9e9e9', endColorstr='#f9f9f9',GradientType=0);
	background-color:#e9e9e9;
}
.grayButton:active {
	position:relative;
	top:1px;
}

.effacer
{
    font-family: arial;
    font-size: 13px;
    padding: 4px 8px;
}

.connexion{
    	font-family:arial;
	font-size:15px;
	font-weight:bold;
	padding:6px 24px;
}

.connexionKey
{
    position: relative;
    z-index: 1;
    margin-right: -32px;
    vertical-align: middle;
    width: 28px;
}

.bulle
{
    background-color : #CAE1E1;
    border-radius: 10px;
    margin-bottom: 20px;
    padding-bottom: 10px;
    padding-left: 15px;
    width:290px;
}
.bulle_padding{
    margin-left:20px;
}

/*Text style*/
.error{color:red;}
.bold{font-weight: bold;}